<template>
    <div>
        <ul class="mui-table-view  mui-table-view-chevron">
				<li class="mui-table-view-cell mui-media" v-for="item in newslist" :key="item.id">
					<router-link :to="'/home/newsinfo/'+item.id" class="mui-navigate-right">
						<img class="mui-media-object mui-pull-left" :src="item.img">
						<div class="mui-media-body">
							<h1>{{ item.name }}</h1>
							<p class='mui-ellipsis'>
                                <span>发表时间：{{ item.date | dateFormat('YYYY-MM-DD HH:mm:ss') }}</span>
                                <span>点击: {{ item.count }} 次</span>
                            </p>
						</div>
					</router-link>
				</li>
				

			</ul>
    </div>
</template>

<script>
export default {
    data(){
        return{
            newslist: [], // 新闻资讯列表
        }
    },
    methods: {
        getNewsList(){
            var list = [
                { id:'1', name: '健身卡尽快', date: '2019-09-08', count: '41', img: '../../images/11.jpg'},
                { id:'2', name: '的就撒开附件是的回复', date: '2019-09-09', count: '2', img: '../../images/12.jpg'},
                { id:'3', name: '是积分卡', date: '2019-09-10', count: '3', img: '../../images/13.jpg'},
                { id:'4', name: '飞机萨科', date: '2019-09-10', count: '32', img: '../../images/14.jpg'},
                { id:'5', name: '书法家开好房间', date: '2019-09-10', count: '13', img: '../../images/15.jpg'},
                { id:'6', name: '飞机萨科', date: '2019-09-10', count: '33', img: '../../images/17.gif'},
                { id:'7', name: '复活节卡', date: '2019-09-10', count: '43', img: '../../images/19.gif'},
                { id:'8', name: '阿贾克斯发', date: '2019-09-10', count: '321', img: '../../images/5.jpg'},
                { id:'9', name: '发哈尽快', date: '2019-09-10', count: '32', img: '../../images/6.jpg'},
                { id:'10', name: '纺纱机', date: '2019-09-10', count: '331', img: '../../images/7.jpg'},
                { id:'11', name: '纺纱机', date: '2019-09-10', count: '233', img: '../../images/8.jpg'},
                { id:'12', name: '纺纱机', date: '2019-09-10', count: '313', img: '../../images/0.jpg'},
            ]
            this.newslist = list
        }
    },
    created(){
        this.getNewsList()
    }
    
}
</script>

<style lang="scss" scoped>
.mui-table-view{
    li{
        h1{
            font-size: 14px;
        }
    }
}
.mui-ellipsis{
    font-size: 12px;
    color: #226aff;
    display: flex;
    justify-content: space-between;
}

</style>